import React, { Component } from 'react'
import { connect } from 'react-redux'
import Axios from "axios"
//引入组件
import Index from "../components/Index"
import { NavLink } from 'react-router-dom';
import RouterView from '../router';



export class List extends Component {
  componentWillMount() {

    console.log('this.props', this.props);

    if (!this.props.list.length) {
      this.props.getList();
    }

  }
  render() {
    return (
      <div >
        <NavLink to="/list/listA">列表A</NavLink> <NavLink to="/list/listB">列表B</NavLink>
        <div>
          <RouterView routes={this.props.routes}></RouterView>
        </div>
        {/* 调用组件 */}
        <Index {...this.props} />
      </div>
    )
  }

}

const mapStateToProps = (state) => {
  return {
    ...state
  }
}

const mapDispatchToProps = (dispatch) => {
  return {
    // 数据库存数据
    getList() {
      dispatch(() => {
        Axios.get("/get/list").then(res => {
          dispatch({ type: "SET_LIST", data: res.data.data })
        })
      })
    },
    setList(data) {
      dispatch({ type: "SET_LIST", data: data })
    }
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(List)
